<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>手写ajax</title>
  </head>
  <body>
    <script>
      // 1.创建XMLHttpRequest对象
      // 2.建立与接口的链接
      // 3.发送请求（post请求在这发送数据）
      // 4.监听ajax请求返回的响应结果
      var xhr = new XMLHttpRequest();
      xhr.open("GET", "https://api.uomg.com/api/rand.qinghua");
      xhr.send(null); // GET 请求不需要请求体。null 表示没有请求体。
      xhr.onreadystatechange = function () {
        if (this.readyState === 4 && this.status === 200) {
          console.log(JSON.parse(this.responseText));
        }
      };

      fetch("https://api.uomg.com/api/rand.qinghua")
        .then((response) => {
          if (!response.ok) {
            throw new Error("Network response was not ok");
          }
          return response.json();
        })
        .then((data) => {
          console.log(data);
        })
        .catch((error) => {
          console.error("There was a problem with the fetch operation:", error);
        });
    </script>
  </body>
</html>
